<template>
    <div :id="id"></div>
</template>

<script>
    import E from 'wangeditor'
    import {
        UPLOAD_URL,CONST_DMOMAIN_URL
    } from '@/config/env'

    export default {
        name: 'Editor',
        data() {
            return {
                editor: '',
            }
        },
        mounted() {
            this.editor = new E("#" + this.id)
            this.editor.config.height = 300
            this.editor.config.onchange = (html) => {
                this.$emit('change', html)
            }

            // 上传图片
            this.editor.config.uploadImgServer = UPLOAD_URL + '/uploadImage'
            this.editor.config.uploadImgMaxSize = 1024 * 1024 * 2
            this.editor.config.uploadImgMaxLength = 1
            this.editor.config.uploadFileName = 'file'
            this.editor.config.uploadImgHooks = {
                customInsert: function (insertImgFn, result) {
                    insertImgFn(CONST_DMOMAIN_URL + result.data)
                }
            }
            this.editor.create()
        },
        props: {
            value: {
                type: String,
            },
            id: {
                type: String,
            },
        },
        watch: {
            value: function (val) {
                this.editor.txt.html(val)
            }
        }
    }
</script>

<style scoped>

</style>